<!DOCTYPE html>
<html>
<head>
	<title>我的月读</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link rel="stylesheet" type="text/css" href="./statics/style/public.css">
	<style type="text/css">
		
		.noCourse {
			width: 100%;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: space-around;
			padding-top: 155px;
		}
		.noCourseDes {
			margin:18px auto 57px auto;
			color: #b6b5b6;
			font-size: 17px;
		}
		.courseBtn {
			border:none;
			outline: none;
			width: 160px;
			height: 56px;
			background: url("./statics/img/myCourse/btn.png") no-repeat center;
			font-size: 17px;
			color: #42323d;
		}
		
		.singleCourse img {
			width: 86px;
			height: 100px;
			margin-right: 25px;
		}
		
		.singleCourse .courseName {
			font-size: 17px;
			color: #372c34;
			line-height: 17px;
		}
		.singleCourse span {
			line-height: 19px;
		}
		.singleCourse .status {
			padding-left: 13px;
			margin-top: 7px;
		}
		.courseOn {
			background: url("./statics/img/myCourse/courseOn.png") no-repeat left center;
			color: #07a5bb;
		}
		.wait {
			background: url("./statics/img/myCourse/wait.png") no-repeat left center;
			color: #ff6913;
		}
		.courseOver {
			background: url("./statics/img/myCourse/over.png") no-repeat left center;
			color: #b6b5b6;
		}
	</style>
</head>
<body>
	<div class="mainContent">
		<!-- <div class="noCourse">
			<img src="./statics/img/myCourse/noCourse.png">
			<span class="noCourseDes">您还没有选择课程</span>
			<button class="courseBtn">去选课</button>
		</div> -->
		<div class="hasCourse">
			<div class="singleCourse">
				<img src="./statics/img/myCourse/course.png">
				<div class="courseIntr">
					<span class="courseName">Level1 第一期</span>
					<span>时间：2018.03.07-2018.04.07</span>
					<span class="status courseOn">
						进行中...
					</span>
				</div>
			</div>
			<div class="singleCourse">
				<img src="./statics/img/myCourse/course.png">
				<div class="courseIntr">
					<span class="courseName">Level1 第一期</span>
					<span>时间：2018.03.07-2018.04.07</span>
					<span class="status wait">
						等待开课
					</span>
				</div>
			</div>
			<div class="singleCourse">
				<img src="./statics/img/myCourse/course.png">
				<div class="courseIntr">
					<span class="courseName">Level1 第一期</span>
					<span>时间：2018.03.07-2018.04.07</span>
					<span class="status courseOver">
						已经学完
					</span>
				</div>
			</div>
		</div>
	</div>
</body>
</html>